<style scoped>
    .main {
        height: 100%;
    }

    .main >>> .hd-logo {
        width: auto;
        height: 100%;
    }

    .main >>> .layout-logo {
        width: 36%;
    }

    .home-login {
        color: white;
        font-size: 18px;
        font-weight: bold;
        cursor: pointer;
    }

    .home-name {
        color: white;
        font-size: 18px;
        font-weight: bold;
        margin-right: 4px;
    }
</style>

<template>
    <div class="main">
        <main-theme1
                :siderWidth="220"
                ref="mainTheme"
                :headerMenusShow="closeHeaderMenu"
                logoPath="https://skv4.oss-cn-hangzhou.aliyuncs.com/ji-wei/dang-an-logo.png">
            <router-view></router-view>
            <template slot="headerRight">
                <div class="home-name">{{ getUserName }} |</div>
                <div class="home-login" @click="logout">退出登录</div>
            </template>
        </main-theme1>
    </div>
</template>

<script>
import { mapActions } from 'vuex'
import menus from '@/mock/data/php-menus.js'

export default {
  data () {
    return {
      closeHeaderMenu: true
    }
  },
  methods: {
    ...mapActions([
      'getUserInfo',
      'getPhpMenusData',
      'getJavaMenusData',
      'setBreadCrumb',
      'setMenuListData'
    ]),
    logout () {
      this.$refs.mainTheme.logout()
    }
  },
  computed: {
    getUserName () {
      let userInfo = this.$store.state.user.severUserInfo.data
      if (userInfo) {
        return userInfo.company_name + '【' + userInfo.company_code + '】'
      } else {
        return '未登录'
      }
    }
  },
  mounted () {
    // TODO 如果是java菜单还需要调用综合菜单-id需要自己配置
    this.getUserInfo().then(resx => {})
    // this.getJavaMenusData('0,1,bf0764d1-3373-11ea-ba01-ec0d9acf02d2')
    // mock菜单
    this.setMenuListData(menus.data)
  }
}
</script>
